// 组合试算新增
import { Menu } from 'antd';
import { connect } from 'dva';
import React from 'react';

import menus from './dictMenu';
import style from './style.less';

import { FirstHeaderC } from '../../../comps';
import AddAssetsOrder from '../../InvestmentManage/assetsOrder/orderComps/addAssetsOrder';
import AddOfflineOrder from '../../InvestmentManage/bondOffline/orderComps/addOfflineOrder';
import AddBond from '../../InvestmentManage/BondTradeNew/orderComps/addBond.js';
import BuyBackOrder from '../../InvestmentManage/BuybackOrder/buyBackOrder';
import AddNew from '../../InvestmentManage/depositOrderNew/AddNew';
import AddEtfOrder from '../../InvestmentManage/EtfTradeNew/orderComps/AddEtfOrder';
import AddFinaFlocking from '../../InvestmentManage/finaFlockingNew/orderComps/addFinaFlocking';
import AddFunTrade from '../../InvestmentManage/fundTradeOrder/fundTradeIndex';
import AddHK from '../../InvestmentManage/HKstock/orderComps/addNew';
import AddNonstandardOrder from '../../InvestmentManage/nonstandardOrder/orderComps/addNonstandardOrder';
import AddOuter from '../../InvestmentManage/OutSourcingOrder/components/OutSourcingOrder';
import Index from '../../InvestmentManage/StockOrder/index';
import BondLend from '../TradeBook/BondLending/common/index';

const MenuItem = Menu.Item;
const { SubMenu } = Menu;

class AddNewC extends React.Component {
  state = {
    memu: [], // 左侧导航
    loading: true, // 初始化进入页面，laoding
    selMenuItem: '0', // 默认选中第一条
  };

  componentDidMount() {}

  // “保存”
  onOk = () => {
    this.props.onRefresh();
  };

  // “取消”
  onCancel = () => {
    this.props.onClose();
  };
  // 菜单展示
  getMenu = () => {
    const data =
      menus &&
      menus.map((item) => {
        if (item.children && item.children.length) {
          return (
            <SubMenu title={item.value} key={item.code}>
              {item.children.map((child) => (
                <MenuItem key={child.code} value={child.code}>
                  {child.value}
                </MenuItem>
              ))}
            </SubMenu>
          );
        }
        return (
          <MenuItem key={item.code} value={item.code}>
            {item.value}
          </MenuItem>
        );
      });
    return data;
  };

  showTable = () => {
    const { selMenuItem } = this.state;
    switch (selMenuItem) {
      // 债券指令
      case '0':
        return <AddBond type={11} onOk={this.onOk} onCancel={this.onCancel} currentRouter={window.location.hash} />;
      // 基金交易指令
      case '1':
        return <AddFunTrade type={11} onCancel={this.onCancel} onOk={this.onOk} />;
      // 回购指令
      case '2':
        return <BuyBackOrder type={11} onCancel={this.onCancel} onOk={this.onOk} />;
      // 理财直融
      case '3':
        return <AddFinaFlocking type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      // 存款指令
      case '4':
        return <AddNew state={11} onCancel={this.onCancel} onOk={this.onOk} />;
      // ETF指令
      case '5':
        return <AddEtfOrder type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      // 非标指令
      case '6':
        return <AddNonstandardOrder type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      // 股票指令
      case '7':
        return <Index type='11' rehandleSearch={this.onOk} rehandleSearch2={this.onCancel} />;
      // 债券借贷指令
      case '8':
        return <BondLend type='1' rehandleSearch={this.onOk} rehandleSearch2={this.onCancel} />;
      // 债券网下申购指令
      case '17':
        return <AddOfflineOrder type='2' onOk={this.onOk} onCancel={this.onCancel} />;
      // 港股通
      case '19':
        return <AddHK type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      // 资产管理计划指令
      case '20':
        return <AddAssetsOrder type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      // 委外投资指令
      case '21':
        return <AddOuter type={11} onOk={this.onOk} onCancel={this.onCancel} />;
      default:
        return null;
    }
  };

  render() {
    const { selMenuItem } = this.state;
    return (
      <div>
        <FirstHeaderC title='组合试算新增' />
        <div className={style.bookkeepingMnt}>
          {/* 左侧导航 */}

          <div className={style.left} style={{ height: 'calc(100vh - 170px)' }}>
            <Menu mode='inline' defaultSelectedKeys={[selMenuItem]} onClick={(val) => this.setState({ selMenuItem: val.key })}>
              {this.getMenu()}
            </Menu>
          </div>

          {/* 右侧内容区 */}
          <div className={style.right} style={{ width: 'calc(100% - 200px)', maxHeight: 'calc(100vh - 170px)' }}>
            <div className={style.rightTop}>
              {/* 根据导航，展示内容 */}
              {this.showTable()}
            </div>
          </div>
        </div>
      </div>
    );
  }
}

export default connect(({ dictionaryM, loading }) => ({ dictionaryM, loading }))(AddNewC);
